<template>
  <BenchCompWrapper title="库存健康分析">
    <template v-slot:btn>
      <px-tooltip v-if="!isTop" content="返回上一级" placement="top">
        <px-button class="button" text type="primary" @click="handleGoBack">
          <px-icon><ArrowLeft /></px-icon>
        </px-button>
      </px-tooltip>
      <px-tooltip content="全屏展示" placement="top">
        <px-button class="button" text type="primary" @click="handleEnlarge">
          <px-icon><Fullsreen /></px-icon>
        </px-button>
      </px-tooltip>
      <px-tooltip content="跳转备件台账" placement="top">
        <px-button class="button" text type="primary" @click="goLedger">
          <px-icon><ArrowRight /></px-icon>
        </px-button>
      </px-tooltip>
    </template>
    <template v-slot:content>
      <InventoryHealthAnalysis :data="data" :showTop5Data="true" @getData="getData" @resetCode="resetCode" @pushCode="pushCode" />
    </template>
  </BenchCompWrapper>
</template>

<script lang="ts" setup>
import { useRouter } from "vue-router";

import type { ResponseDataOfHealth } from "@/api/erc/spareParts/signboard";

import BenchCompWrapper from "./BenchCompWrapper.vue";
import InventoryHealthAnalysis from "./InventoryHealthAnalysis.vue";
import type { PropsTypeForPanel, EmitsTypeForPanel } from "../type";

defineProps<PropsTypeForPanel<ResponseDataOfHealth>>();
const emits = defineEmits<EmitsTypeForPanel>();

const router = useRouter();

const handleGoBack = () => {
  emits("back", "health");
};

const handleEnlarge = () => {
  emits("enlarge", "health");
};

const goLedger = () => {
  router.push("/erc/spareParts/ledger");
};

const pushCode = code => {
  emits("pushCode", code);
};

const getData = isTop => {
  emits("getData", isTop);
};

const resetCode = () => {
  emits("reset");
};
</script>
